<template>
  <div class="app-container calendar-list-container">
    <!-- filter 条件查询 -->
    <div class="filter-container">设备编辑：{{ this.equipmentNumber }}</div>
    <!--表格 -->
    <el-table
      :data="list"
      element-loading-text="给我一点时间"
      v-loading="loading.list"
      border
      fit
      highlight-current-row
      style="width: 100%"
    >
      <el-table-column prop="index" label="序号" align="center" width="80px" />
      <el-table-column prop="mouthNoShow" label="格口编号" align="center" />>
      <el-table-column prop="isFlowInfo" label="格口类型" align="center" />
      <el-table-column prop="mouthStatusInfo" label="状态" align="center" />
      <el-table-column label="操作" align="center">
        <template slot-scope="scope">
          <span v-show="scope.row.mouthStatus == 1">
            <el-button @click="openLock(scope.row.mouthId)" type="danger"
              >结束充电</el-button
            >
          </span>
          <span
            v-show="!(scope.row.mouthStatus == 0 || scope.row.mouthStatus == 1)"
          >
            <el-button
              type="success"
              size="mini"
              style="margin-top: 5px"
              @click="restoration(scope.row.mouthId)"
              >复位</el-button
            >
          </span>

          <el-button
            type="primary"
            size="mini"
            style="margin-top: 5px"
            @click="queryStatus(scope.row.mouthId)"
            >查询/更新 状态</el-button
          >
          <span v-show="equipmentType==5">
            <el-button
            @click="openDoor(scope.row.mouthId)"
            type="danger"
          >强制开门 </el-button>
              </span>
          <br />
        </template>
      </el-table-column>
    </el-table>
    <!-- pagination 分页 -->
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="listQuery.offset"
        :page-sizes="[10, 20, 30, 40]"
        :page-size="listQuery.limit"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>
    <!-- 回到顶部 -->
    <BackToTop></BackToTop>
  </div>
</template>
<script>
import {
  getEquipmentMouthList,
  openLock,
  restoration,
  queryStatus,
  openDoor
} from "@/api/equipment";
import BackToTop from "@/components/BackToTop";
export default {
  name: "equipment_equipmentDate",
  components: {
    BackToTop,
  },
  data() {
    return {
      loading: {
        list: false,
      },
      dialog: {
        view: false,
      },
      equipmentNumber: this.$route.query.equipmentNumber,
      equipmentType: this.$route.query.equipmentType,
      total: 0,
      listQuery: {
        offset: 1,
        limit: 10,
        equipmentId: this.$route.query.equipmentId,
      },
      list: null,
      downloadLoading: false,
    };
  },

  methods: {
          //开门
    openDoor(mouthId) {
      this.$confirm("确认强制开门？  （1.请先确认是否有订单，以免造电瓶丢失！ 2.若正在充电，请先结束充电。不然充电数据可能会丢失！）", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(async () => {
        try {
           //调用服务器接口
      const { data } = await openDoor({ mouthId});
          this.$message({
            type: "success",
            message: "开门发送成功!"
          });
          this.getList();
        } catch (error) {}
      });
    },
    //修改状态
    openLock(mouthId) {
      this.$confirm("确认结束充电？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(async () => {
        try {
          //调用服务器接口
          const { data } = await openLock({ mouthId });
          this.$message({
            type: "success",
            message: "结束充电命令发送成功!",
          });
          this.getList();
        } catch (error) {}
      });
    },
    restoration(mouthId) {
      this.$confirm(
        "确认复位？(注意：异常情况下使用，复位不一定有效)",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      ).then(async () => {
        try {
          //调用服务器接口
          const { data } = await restoration({ mouthId });
          this.$message({
            type: "success",
            message: "复位命令发送成功!",
          });
          this.getList();
        } catch (error) {}
      });
    },

    queryStatus(mouthId) {
      this.$confirm("确认查询/更新状态？(注意：更新为当前状态)", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(async () => {
        try {
          //调用服务器接口
          const { data } = await queryStatus({ mouthId });
          this.$message({
            type: "success",
            message: "查询/更新 命令发送成功!",
          });
          this.getList();
        } catch (error) {}
      });
    },

    //获取列表
    async getList() {
      this.loading.list = true;
      try {
        //调用服务器接口
        const { data } = await getEquipmentMouthList({
          ...this.listQuery,
        });
        this.list = data.records.map((item, index) => ({
          index: index + 1,
          isFlowInfo: item.isFlow == 1 ? "交流" : "直流",
           doorStatusInfo:
            this.equipmentType == 5
              ? item.doorStatus == 0
                ? "开"
                : item.doorStatus == 1
                ? "关"
                : item.doorStatus == 2
                ? "超时未关门"
                : item.doorStatus == 3
                ? "异常"
                : "-"
              : "-",
          temperatureInfo: this.equipmentType == 5 ? item.temperature : "-",
          mouthStatusInfo:
            item.mouthStatus == 0
              ? "空闲"
              : item.mouthStatus == 1
              ? "充电中"
              : item.mouthStatus == 2
              ? "电池充满"
              : item.mouthStatus == 3
              ? "限额充电"
              : item.mouthStatus == 4
              ? "电池识别异常"
              : item.mouthStatus == 5
              ? "输出短路故障"
              : item.mouthStatus == 6
              ? "输出过压"
              : item.mouthStatus == 7
              ? "输出过流"
              : item.mouthStatus == 8
              ? "系统过温"
              : item.mouthStatus == 9
              ? "NTC异常"
              : item.mouthStatus == 10
              ? "电池故障"
              : item.mouthStatus == 11
              ? "负载断电"
              : item.mouthStatus == 12
              ? "电源故障"
              : item.mouthStatus == 13
              ? "通讯超时"
              : item.mouthStatus == 14
              ? "过压关机"
              : item.mouthStatus == 15
              ? "电池反接"
              : item.mouthStatus == 16
              ? "充电超时"
              : "-",
          ...item,
        }));
        this.total = data.total;
      } catch (error) {}
      this.loading.list = false;
    },
    //点击查找
    handleFilter() {
      this.listQuery.offset = 1;
      this.getList();
    },
    handleSizeChange(val) {
      this.listQuery.limit = val;
      this.getList();
    },
    handleCurrentChange(val) {
      this.listQuery.offset = val;
      this.getList();
    },
  },

  created() {
    this.getList();
  },
};
</script>
<style lang="scss" scoped>
/deep/ .el-carousel__container {
  height: 500px !important;
}
</style>
